<template>
  <div>
    Big
    <keep-alive>
        <component :is="currentView"> </component>
    </keep-alive>
    <!-- {{currentView}} -->
    <button @click="changeView">切换组件</button>
  </div>
</template>

<script>
import Samll1 from "./small1";
import Samll2 from "./small2";
export default {
  name: "big",
  components: {
    Samll1,
    Samll2
  },
  data() {
    return {
        currentView:"Samll1",
        flag:true
    };
  },
  methods:{
      changeView(){
        //   this.currentView="Samll2"
        if(this.flag){
            this.currentView="Samll2";
            this.flag = false
        }else{
            this.currentView="Samll1";
            this.flag = true
        }
      }
  }
};
</script>

<style scoped>
</style>